<template>
	<view>
		  <view class="cu-list menu-avatar  card-menu martop" >

		    <view class="cu-item" v-for="(item,index) in lists" :key="index" @tap="toChat(index)">
				<image class="cu-avatar round lg " :src='item.icon'   @tap="toUserMain(item.user_id)"></image>

		      <view class="content">
		        <view class="text-grey">
		          <text class="text-cut">{{item.user_name}}</text>
<!-- 		          <view class="cu-tag round bg-orange sm">战士</view> -->
		        </view>
		        <view class="text-gray text-sm flex">
		          <text class="text-cut">{{item.characters.slice(0,2)+"..."}}</text>
		        </view>
		      </view>
		      <view class="action">
		        <view class="text-grey text-xs focus">
					已关注
				</view>
<!-- 		        <view class="cuIcon-notice_forbid_fill text-gray"></view> -->
		      </view>
		    </view>
		  </view>
		<!-- 聊天消息end -->
		<button type="primary" class="back" @tap="toMatch()">返回</button>
	</view>
</template>

<script>

	export default {
		data() {
			return {
				lists:[
					{
						"user_id":"q1",
						"user_name":"userone",
						"password":"123456",
						"icon":"https://ossweb-img.qq.com/images/lol/web201310/skin/big10001.jpg",
						"characters":["游泳","跑步"],						
					}
				]
			}
		},
		onLoad() {

		},
		onShow() {
			uni.setNavigationBarTitle({
				title:"匹配结果"
			})	
		},
		methods: {
			toChat:function(index){
				
			},
			toUserMain(id){
				 uni.navigateTo({
					url:'../../user-detail/user-detail?user_id='+id
				 })
			},
			toMatch(){
				uni.reLaunch({
					url:"../match"
				})
			}
		}
	}
</script>

<style scoped>
	.icon{
		width: 50px;
		height: 50px;
		border-radius: 50px 50px;
	}
	.focus{
		background: #e12294;
		color: white;
	}
	.back{
		margin-top: 40%;
		width: 50%;
	}
</style>